<template>
	<view>
		<view>
					<view  class="cell" hover-class="cell_hover" >
						<view class="label">头像</view>
						<view class="value">
							<image  v-if="userinfo" class="avatar" :src="userinfo.avatar?userinfo.avatar:'/static/logo.png'" mode=""></image>
							<image  v-else class="avatar" src="/static/192x192.png" mode=""></image>
							<!-- <image src="/static/arrowright.png" class="arrow-icon"></image> -->
						</view>
					</view>
			
					<view v-if="userinfo" class="cell" hover-class="cell_hover" @click="tz('/pages/login-mobile/login-mobile-nickname')">
						<view class="label">昵称</view>
						<view class="value">
							<text class="value-text">{{userinfo.nickname}}</text>
							<image src="/static/arrowright.png" class="arrow-icon"></image>
						</view>
					</view>
					<view v-else class="cell" hover-class="cell_hover" >
						<view class="label">昵称</view>
						<view class="value">
							<text class="value-text">请先登录</text>
							<image src="/static/arrowright.png" class="arrow-icon"></image>
						</view>
					</view>
			<!-- 
					<view class="cell" hover-class="cell_hover">
						<view class="label">隐私设置</view>
						<view class="value">
							<text class="value-text"></text>
							<image src="/static/arrowright.png" class="arrow-icon"></image>
						</view>
					</view> -->
			
					<view v-if="userinfo" class="cell" hover-class="cell_hover"  @click="tz('/pages/login-mobile/login-mobile-wang')">
						<view class="label">更换手机</view>
						<view class="value">
							<text class="value-text">{{userinfo.mobile}}</text>
							<image src="/static/arrowright.png" class="arrow-icon"></image>
						</view>
					</view>
					<view v-else class="cell" hover-class="cell_hover" >
						<view class="label">更换手机</view>
						<view class="value">
							<text class="value-text">请先登录</text>
							<image src="/static/arrowright.png" class="arrow-icon"></image>
						</view>
					</view>
					
					
			
					<view v-if="userinfo&&lang==0" class="cell" hover-class="cell_hover" @click="tz('/pages/login-mobile/login-mobile-jiaoyi')">
						<view class="label">绑定交易所</view>
						<view class="value">
							<text class="value-text"></text>
							<text v-if="userinfo.jy_account">已绑定</text>
							<image src="/static/arrowright.png" class="arrow-icon"></image>
					
						</view>
					</view>
			<!-- 
					<view class="cell" hover-class="cell_hover">
						<view class="label">关于《潮玩宇宙》</view>
						<view class="value">
							<text class="value-text"></text>
							<image src="/static/arrowright.png" class="arrow-icon"></image>
						</view>
					</view> -->
			
					<view  class="cell" hover-class="cell_hover" v-if="lang==0&&userinfo && userinfo.pid==0" @click="tz('/pages/login-mobile/login-mobile-wang-shangji')">
						<view class="label">绑定推荐码</view>
						<view class="value">
							<text class="value-text"></text>
							<image src="/static/arrowright.png" class="arrow-icon"></image>
						</view>
					</view>
					
					<view  class="cell" hover-class="cell_hover" @click="tz('/pages/index/xieyi?id=1')">
						<view class="label">隐私协议</view>
						<view class="value">
							<text class="value-text"></text>
							<image src="/static/arrowright.png" class="arrow-icon"></image>
						</view>
					</view>
			
					<view class="fixed-wrap">
						<button @click="logoutHandle" class="btn-login">退出登录</button>
					</view>
		</view>

		<fui-dialog :buttons="buttons" title="退出登录" @click="dialogConfirm" :show="showDialog" content="是否确认退出登录?"></fui-dialog>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				lang:1,
				showDialog: false,
				userinfo:null,	
				buttons: [
					{ text: '取消', color: '#666' },
					{ text: '确定', color: '#333' }
				]
			};
		},
		onShow() {
			let lang = uni.getStorageSync('lang')
			this.lang = lang
			if(uni.getStorageSync('token')){
				this.get_info()
			}
		},
		methods: {
			tz(url){
				uni.navigateTo({ url: url});
			},
			get_info(){
				uni.showLoading({ title: '正在加载', mask: true });
				var _this = this;
				_this.$api.request('/api/user/get_info', {page:this.page}, uni.getStorageSync('token'), function(res) {
					uni.hideLoading();
					if (res.code == 1) {
						_this.userinfo = res.data;
						
					}
					uni.hideLoading();
				});
			},
			// 退出登录
			logoutHandle() {
				this.showDialog = true;
			},

			// 退出登录确认
			dialogConfirm(e) {
				console.log(e,77777)
				if (e.index === 0) {
					// 取消
					this.showDialog = false;
				} else {
					
					uni.reLaunch({
					    url:'/pages/login/login'
					});
					this.showDialog = false;
				}
	
														
			}
		}
	};
</script>

<style lang="scss">
	.cell {
		font-size: 25rpx;
		position: relative;
		display: flex;
		align-items: center;
		padding: 40rpx 32rpx;

		&::after {
			content: '';
			position: absolute;
			left: 32rpx;
			right: 32rpx;
			bottom: 0;
			height: 1px;
			background: #f3f3f3;
		}

		.label {
			flex: 1;
		}

		.value {
			display: flex;
			align-items: center;
			color: #999;
		}

		.value-text {
			margin-right: 12rpx;
		}

		.arrow-icon {
			width: 32rpx;
			height: 32rpx;
		}

		.avatar {
			width: 65rpx;
			height: 65rpx;
			margin-right: 12rpx;
			border-radius: 50%;
			overflow: hidden;
		}
	}

	.cell_hover {
		background: rgba(0, 0, 0, 0.1);
	}

	.fixed-wrap {
		position: fixed;
		left: 48rpx;
		right: 48rpx;
		bottom: 100rpx;
		.btn-login {
			background: #333;
			color: #fff;
			font-weight: bold;
			height: 100rpx;
			line-height: 100rpx;
		}
	}
</style>
